<template>
	<div class="inspection-container">
		<BaseInfo :info="record.info" :isProcessAi="isProcessAi" />
		<VideoList :videoList="record.videos" :isProcessAi="isProcessAi" :originalVideoCount="record.originalVideoCount" />
		<SessionInfo :sessionInfo="record.session" :baseInfo="record.info" @pass="refesh" @update="refesh" @reject="refesh" :isProcessAi="isProcessAi" />
	</div>
</template>

<script>
import BaseInfo from './components/BaseInfo.vue';
import VideoList from './components/VideoList.vue';
import SessionInfo from './components/SessionInfo.vue';
// import { steps } from './mock/session';
// import { videos } from './mock/videos';
// import { info } from './mock/info';
import { getBizrecordDetail } from '@/api/api.js';
export default {
	components: { BaseInfo, VideoList, SessionInfo },
	data() {
		return {
			record: {
				info: {},
				videos: [],
				session: []
			},
			sessionId: this.$route.query.sessionId,
			isProcessAi: true
		};
	},
	mounted() {
		this.getBizrecordDetail();
		// this.record.videos = videos.sort(function (a, b) {
		// 	// Turn your strings into dates, and then subtract them
		// 	// to get a value that is either negative, positive, or zero.
		// 	return new Date(b.startedAt) - new Date(a.startedAt);
		// });
		// steps.map(item => {
		// 	item.startedAt = item.startedAt ? this.$moment(item.startedAt).format('YYYY-MM-DD HH:mm:ss') : '-';
		// 	item.closedAt = item.closedAt ? this.$moment(item.closedAt).format('YYYY-MM-DD HH:mm:ss') : '-';
		// 	item.duration = this.formatDuration(item.duration / 1000);
		// });
		// this.record.session = [...steps];
	},

	methods: {
		// 初始化获取业务记录详情
		getBizrecordDetail() {
			getBizrecordDetail(this.sessionId)
				.then(res => {
					if (res.data && res.data.code === 200 && res.data.message) {
						this.record.info = {};
						this.record.session = [];
						this.record.videos = [];
						const { bizscenario, processRecords, recordings, status, version, updatedAt, businessflowId, id } = res.data.message;
						this.record.info = Object.assign({}, bizscenario, {
							status: status,
							version: version,
							updatedAtOrigin: updatedAt,
							updatedAt: updatedAt ? this.$moment(updatedAt).format('YYYY-MM-DD HH:mm:ss') : '-',
							businessflowId: businessflowId,
							inspectionId: id
						});
						processRecords.map(item => {
							item.startedAt = item.startedAt ? this.$moment(item.startedAt).format('YYYY-MM-DD HH:mm:ss') : '-';
							item.closedAt = item.closedAt ? this.$moment(item.closedAt).format('YYYY-MM-DD HH:mm:ss') : '-';
							item.duration = this.formatDuration(item.duration / 1000);
						});
						// 对 processRecords 按照 id 排序
						processRecords.sort(function (a, b) {
							return a.id - b.id;
						});
						this.record.session = [...processRecords];
						this.record.videos = recordings.sort(function (a, b) {
							return a && b ? new Date(b.startedAt) - new Date(a.startedAt) : false;
						});
						const groupedData = this.record.videos.reduce((acc, item) => {
							const sessionId = item.sessionId;
							if (!acc[sessionId]) {
								acc[sessionId] = [];
							}
							acc[sessionId].push(item);
							return acc;
						}, {});

						const originalVideoCount = this.record.videos.filter(item => item.isOriginalVideo).length;
						const patchCount = Object.keys(groupedData).length - Math.min(1, originalVideoCount);
						this.record.originalVideoCount = originalVideoCount;
						console.log('groupedData ', patchCount, groupedData);
						Object.keys(groupedData).map((key, i) => {
							const count = groupedData[key].length;
							groupedData[key].map((item, index) => {
								item.title = item.isOriginalVideo ? `初始录像${1}-${count - index}` : `补录录像${patchCount - i}-${count - index}`
							});
						})
						
						this.isProcessAi = this.record.session.length > 0;
					} else {
						console.error('业务记录详情', res.data);
						this.$message.warning('获取业务记录详情失败');
					}
				})
				.catch(err => {
					console.error('获取业务记录详情', err);
					this.$message.warning('获取业务记录详情失败');
				})
				.finally(() => {
					this.$Spin.hide();
				});
		},
		refesh() {
			// this.$router.go(0);
			this.getBizrecordDetail();
		},
		formatDuration(duration) {
			let hours = Math.floor(duration / 3600);
			let minutes = Math.floor((duration - hours * 3600) / 60);
			let seconds = duration - hours * 3600 - minutes * 60;

			if (hours < 10) {
				hours = '0' + hours;
			}
			if (minutes < 10) {
				minutes = '0' + minutes;
			}
			if (seconds < 10) {
				seconds = '0' + seconds;
			}
			return hours + ':' + minutes + ':' + seconds;
		}
	}
};
</script>

<style lang="less" scoped>
.inspection-container {
	color: #666;
	padding: 20px;
}
</style>
